<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorator="template">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <title>会员管理</title>
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/userCenter.css"/>
    <link rel="stylesheet" href="../css/zoomify.css" />
    <script src="../js/userCenter.js"></script>
    <script src="../js/zoomify.min.js"></script>
    <script type="text/javascript" src="../js/messageSet.js"></script>
    <script type="text/javascript" src="../js/messageJson.js"></script>

</head>
<body id="orange">
<div class="container">

    <div class="content">

        <div class="container-right" layout:fragment="content" >
            <div class="crumbs">
                <ul>
                    <li><a href="/index/home" th:text="#{System.home}">首页</a><i class="triangle-icon"></i></li>
                    <li><a href="/userCenter/userInfo" th:text="#{System.member}">会员管理</a><i class="triangle-icon"></i></li>
                    <li class="active"><a href="" th:text="#{userCenterHtml.userCenter}">会员中心</a></li>
                </ul>
            </div>
            <main>
                <section>
            <div class="detailSub">
                <form id="userCenterForm" action="/userCenter/editFront" method ="post" enctype="multipart/form-data">
                <div class="page-main">

                    <div hidden="hidden">
                        <input id="paytype" th:value="${baseUser.paytype}" hidden="hidden"/>
                        <input id="userType" th:value="${baseUser.usertype}" hidden="hidden"/>
                        <input id="verifyphotohid" name="verifyphotohid" th:value="${baseUser.verifyphoto}" hidden="hidden"/>
                    </div>
                    <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                           <label th:text="#{userCenterHtml.userName}">用户名</label>
                        </div>
                       <input type="text" name="username" class="text" style="width:200px;" th:value="${baseUser.username}" disabled="disabled"/>
                    </div>

                    <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.weChatName}">微信名</label>
                        </div>
                        <input type="text" class="btnText" style="width:200px;" th:value="${baseUser.wechatname}" disabled="disabled"/>
                        <button  class="btnPhone" style="width: 120px" th:text="#{userCenterHtml.boundWeChat}" id = "btnBoundWeChat" onclick="return wechatShow()">绑定微信</button>
                    </div>

                    <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.password}">密码</label>
                        </div>
                        <input type="password" class="btnText" style="width:200px;"  th:value="${baseUser.userpwd}" disabled="disabled"/>
                        <button  class="btnPhone" style="width: 120px" th:text="#{userCenterHtml.updPassword}" id="btnPassWord" onclick="return passWordShow()">修改密码</button>
                    </div>

                    <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.telphone}">手机号码</label>
                        </div>
                        <input type="text" class="btnText" style="width:200px;" th:value="${baseUser.telphone}" disabled="disabled"/>
                        <button  class="btnPhone" style="width: 120px" th:text="#{userCenterHtml.updTelphone}" id="btnPhone" onclick="return phoneShow()">修改手机号码</button>
                    </div>

                    <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.userType}">用户类型</label>
                        </div>
                        <input type="text" th:if ="${baseUser.usertype}==0" class="text100" style="width:100px;" th:value="#{userCenterHtml.userTypePerson}" disabled="disabled"/>
                        <input type="text" th:if ="${baseUser.usertype}==1" class="text100" style="width:100px;" th:value="#{userCenterHtml.userTypeCompany}" disabled="disabled"/>
                        <input type="text" th:if ="${baseUser.usertype}==2" class="text100" style="width:100px;" th:value="#{userCenterHtml.userTypeProxy}" disabled="disabled"/>

                    </div>

                    <div style="height: 30px">
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.realname}">真实姓名</label>
                        </div>
                        <input id="realname" name="realname" type="text" class="text" style="width:200px;" th:value="${baseUser.realname}" maxlength="20"/>

                    </div>

                    <div class="form-validate">
                        <i></i>
                        <span></span>
                    </div>

                    <div style="height: 30px">
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.idcard}">身份证号</label>
                        </div>
                        <input id="idcard" name="idcard" type="text" class="text" style="width:200px;" th:value="${baseUser.idcardno}" maxlength="18"/>
                    </div>

                    <div class="form-validate">
                        <i></i>
                        <span></span>
                    </div>

                    <div id="company" >
                        <div>
                            <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                                <label th:text="#{userCenterHtml.companyname}">公司名称</label>
                            </div>
                            <input id="companyname" name="companyname" type="text" class="text" style="width:200px;margin-bottom:5px;" th:value="${baseUser.companyname}" maxlength="20"/>
                        </div>

                        <div class="form-validate">
                            <i></i>
                            <span></span>
                        </div>

                        <div>
                            <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                                <label th:text="#{userCenterHtml.verifyphoto}">营业执照</label>
                            </div>
                            <div class="form-list">
                                  <span id="filePicker" class="selectfile"><span th:text="#{userCenterHtml.verifyphotoSel}"></span>
                                  <input type="file" id="verifyphoto" name="verifyphoto"  style="position:absolute;left:0;top:0;z-index:999;opacity:0;cursor: pointer; direction: ltr;font-size: 0;width: 80%;height:100%" accept="image/gif, image/jpeg, image/png, image/jpg"/>
                                  </span>
                                  <img id="image-holder" class="thumb-image" th:src="${baseUser.verifyphoto}" />
                            <span id="fileDel" th:text="#{userCenterHtml.verifyphotoDel}" class="delfile" style="display: block;">移除</span>
                            </div>
                        </div>

                    </div>
                    <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.userlevel}">会员等级</label>
                        </div>
                        <input type="text" class="text" style="width:200px;" th:value="${baseUser.userlevel}" disabled="disabled"/>
                    </div>

                    <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.integral}">会员积分</label>
                        </div>
                        <input type="text" class="text" style="width:200px;" th:value="${baseUser.integral}" disabled="disabled"/>
                    </div>

                        <div>
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.maxcar}">最大绑定车辆数</label>
                        </div>
                        <input type="text" class="text" style="width:200px;" th:value="${baseUser.maxcar}" disabled="disabled"/>
                    </div>

                    <div >
                        <div style="width: 350px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{userCenterHtml.payType}">缺省支付方式选择</label>
                        </div>

                        <div class="payment" >

                            <div class="online-payment">
                                <input type="radio" value="0" name="payment" id="weChatPayment" select="selected"/>
                                <span  id= "spanactive" class="online-payment-custom active"></span>
                                <label for="weChatPayment" style="width:44px;" th:text="#{userCenterHtml.wechatpay}">微信</label>
                            </div>
                            <div class="shop-payment">
                                <input type="radio" value="1" name="payment" id="shopPayment"/>
                                <span class="shop-payment-custom"></span>
                                <label for="shopPayment" style="width:60px;" th:text="#{userCenterHtml.alipay}">支付宝</label>
                            </div>
                            <div class="shop-payment">
                                <input type="radio"  value="2" name="payment" id="bankPayment"/>
                                <span class="shop-payment-custom"></span>
                                <label for="bankPayment" th:text="#{userCenterHtml.bankFastPay}">银行快捷支付</label>
                           </div>
                        </div>
                    </div>

                    <div >
                        <button class="btnSub" type="button" style="width:214px" onclick="commitFn()" th:text="#{userCenterHtml.submit}" >提交</button>
                    </div>
                </div>
                </form>

                <!--绑定微信-->
                <div id="light" class="pay" onselectstart='return false;'>
                    <div class="dialog-title"  onselectstart="return false;" >
                        <span style="font-weight:bold;" th:text="#{userCenterHtml.boundWeChat}">绑定微信</span>
                        <a href="javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'"  class="btn-close"></a>
                    </div>
                     <div class="QRCode-content">
                        <img src="../img/QRCode.png" alt="" />
                        <p style="margin-left: 38px" th:text="#{userCenterHtml.QRCode}">请扫描二维码绑定微信</p>
                    </div>
                </div>
                <div id="fade" class="black_overlay"></div>

                <!--修改密码-->
                <div id="divPassWord" class="pay" onselectstart='return false;'>
                    <div class="dialog-title" id="divPWD"  onselectstart="return false;" >
                        <span style="font-weight:bold;" th:text="#{userCenterHtml.updPassword}">修改密码</span>
                        <a href="javascript:void(0)" onclick = "document.getElementById('divPassWord').style.display='none';document.getElementById('passWordBlack').style.display='none'"  class="btn-close"></a>
                    </div>
                    <form id="updPassword">
                        <div style="height: 30px">
                            <div style="width: 75px;text-align: right;margin-bottom: -28px;margin-top: 35px;">
                                <label th:text="#{userCenterHtml.oldPassword}">原密码</label>
                            </div>
                            <input type="password" id="password" class="popText" style="width:182px;" maxlength="30"/>
                        </div>
                        <div class="password-validate">
                            <i></i>
                            <span></span>
                        </div>
                        <div style="height: 30px">
                            <div style="width: 75px;text-align: right;margin-bottom: -28px;">
                                <label th:text="#{userCenterHtml.newPassword}">新密码</label>
                            </div>
                            <input type="password" id="newPassword" class="popText" style="width:182px;" maxlength="30"/>
                        </div>
                        <div class="password-validate">
                            <i></i>
                            <span style="width: 300px;"></span>
                        </div>
                        <div style="height: 30px">
                            <div style="width: 75px;text-align: right;margin-bottom: -28px;">
                                <label th:text="#{userCenterHtml.rePassword}">确认新密码</label>
                            </div>
                            <input type="password" id="rePassword" class="popText" style="width:182px;" maxlength="30"/>
                        </div>

                        <div class="password-validate">
                            <i></i>
                            <span></span>
                        </div>
                    </form>
                    <button onclick ="passwordFn()" class="payBtn" th:text="#{userCenterHtml.confirm}">确定</button>

                </div>
                <div id="passWordBlack" class="black_overlay"></div>

                <!--修改手机号码-->
                <div id="divPhone" class="popPhone">
                    <div class="dialog-title"  onselectstart="return false;" >
                        <span th:text="#{userCenterHtml.updTelphone}">修改手机号码</span>
                        <a href="javascript:void(0)" onclick = "document.getElementById('divPhone').style.display='none';document.getElementById('divPhoneBlack').style.display='none'"  class="btn-phoneClose"></a>
                    </div>
                     <form id="updTelphone">
                        <div style="height: 30px">
                            <div style="width: 60px;text-align: right;margin-bottom: -28px;margin-top: 35px;">
                                <label th:text="#{userCenterHtml.oldTelphone}">原号码</label>
                            </div>
                            <input type="text" class="popPhoneText" style="width:185px;" th:value="${baseUser.telphone}" disabled="disabled"/>
                        </div>
                         <div class="phone-validate">
                             <i></i>
                             <span></span>
                         </div>
                        <div style="height: 30px">
                            <div style="width:60px;text-align: right;margin-bottom: -28px;">
                                <label th:text="#{userCenterHtml.newTelphone}">新号码</label>
                            </div>
                            <input  id="telPhone" name="telPhone" type="text" class="popPhoneText" style="width:185px" maxlength="12"/>

                        </div>

                         <div class="phone-validate">
                             <i></i>
                             <span></span>
                         </div>

                        <div style="height: 30px">
                            <div style="width: 60px;text-align: right;margin-bottom: -28px;">
                                <label th:text="#{userCenterHtml.telIdentify}">验证码</label>
                            </div>
                            <input id="telIdentify" name="telIdentify" type="text" class="popPhoneText" style="width:90px;" maxlength="6"/>
                            <button id="phoneVcodeUser" th:text="#{userCenterHtml.telIdentifyBtn}" class="btnPhone" style="width: 90px" onclick="phoneVcode();return false">获取验证码</button>
                        </div>

                         <div class="phone-validate">
                             <i></i>
                             <span></span>
                         </div>
                    </form>
                    <button onclick ="phoneFn()" type="button"  class="payBtn" th:text="#{userCenterHtml.confirm}">确定</button>

                </div>

                <div id="divPhoneBlack" class="black_overlay"></div>

            </div>

            </section>
            </main>
        </div>
    </div>
</div>

</body>
</html>